<template>
  <div
    style="
      height: 853px;
      padding-bottom: 37px;
      overflow: auto;
      overflow-x: hidden;
    "
  >
    <div style="margin-top: 20px">
      <span class="cameraStyle">cameraNum<br /></span>
      <!-- <el-form-item label=""> -->
      <el-select
        v-model="camera_number"
        placeholder="请选择"
        style="padding-left: 15px; width: 96.7%; margin-bottom: -30px"
      >
        <el-option
          style="font-size: 20px"
          v-for="(item, index) in cameraList"
          :key="index"
          :value="item"
          :label="item"
        ></el-option>
      </el-select>
      <!-- </el-form-item> -->
    </div>
    <ncform
      :form-schema="formSchema"
      form-name="your-form-name"
      v-model="formSchema.value"
      @submit="submit()"
    ></ncform>
    <div style="text-align: center">
      <el-button @click="submit()">开始测试</el-button>
    </div>
  </div>
</template>

<script>
//import { mapState, mapGetters, mapActions } from "vuex";
import { mapState, mapActions } from "vuex";

export default {
  data() {
    return {
      camera_number: "",
      formSchema: {
        type: "object",
        properties: {
          ip: {
            type: "string",
            value: "192.168.9.85",
            ui: {
              columns: 6,
              label: "ip",
            },
          },
          port: {
            type: "number",
            value: "443",
            ui: {
              columns: 6,
              label: "port",
            },
          },
          user: {
            type: "string",
            value: "admin",
            ui: {
              columns: 6,
              label: "user",
            },
          },
          // cameraNum: {
          //   type: "string",
          //   value: "51b4eca4-3d7c-4a7d-82dc-71fdcbc35e85",
          //   ui: {
          //     columns: 6,
          //     label: "cameraNum",
          //     widget: "select",
          //     widgetConfig: {
          //       enumSource: [
          //         {
          //           value: "51b4eca4-3d7c-4a7d-82dc-71fdcbc35e83",
          //           label: "51b4eca4-3d7c-4a7d-82dc-71fdcbc35e83"
          //         },
          //         {
          //           value: "51b4eca4-3d7c-4a7d-82dc-71fdcbc35e84",
          //           label: "51b4eca4-3d7c-4a7d-82dc-71fdcbc35e84"
          //         },
          //         {
          //           value: "51b4eca4-3d7c-4a7d-82dc-71fdcbc35e85",
          //           label: "51b4eca4-3d7c-4a7d-82dc-71fdcbc35e85"
          //         },
          //         {
          //           value: "baee05a7-166a-48f8-9a57-3754c1a7ac65",
          //           label: "baee05a7-166a-48f8-9a57-3754c1a7ac65"
          //         },
          //         {
          //           value: "aef89ecc-4cc6-4a6d-80fd-283196105b0b",
          //           label: "aef89ecc-4cc6-4a6d-80fd-283196105b0b"
          //         }
          //       ]
          //     }
          //   }
          // },
          startTime: {
            type: "number",
            value: "1",
            ui: {
              columns: 6,
              label: "startTime",
            },
          },
          endTime: {
            type: "number",
            value: "1",
            ui: {
              columns: 6,
              label: "endTime",
            },
          },
          department: {
            type: "string",
            value: "video",
            ui: {
              columns: 6,
              label: "department",
            },
          },
        },
      },
    };
  },
  props: ["queryType", "company"],
  computed: {
    ...mapState(["cameraList"]),
  },
  methods: {
    ...mapActions(["getQueryInfo"]),
    submit() {
      let sendParams = {
        queryType: this.queryType,
        ip: this.formSchema.value.ip,
        port: this.formSchema.value.port,
        user: this.formSchema.value.user,
        cameraNum: this.camera_number,
        videoType: this.formSchema.value.videoType,
        action: this.formSchema.value.action,
        step: this.formSchema.value.step,
        username: this.company,
      };
      console.log("sendParams：", sendParams);
      this.getQueryInfo(sendParams);
    },
  },
};
</script>

<style>
.cameraStyle {
  font-size: 20px;
  font-weight: bold;
  text-align: right;
  vertical-align: middle;
  /* float: left; */
  line-height: 40px;
  padding: 0 12px 0 0 !important;
  box-sizing: border-box;
  color: #0d285d;
  margin-left: 15px;
}
</style>
